/**
 * @param 单图提交
 * @param file 为input[type='file']的id
 * @param submit 为提交按钮的id
 * @param url 为图片上传接口
 * @param fn 为异步回调
 */
  //  MC.HOST='';
 /**
  * 示例
  * imgUpload('file', 'submit', 'api/upload', function(e){
  *         cosnole.log(e)
  *     }
  * )
  */

var app_access = 'qSoiKwpWVge4TkaryH6MKvOdceGt7ZMaF20g8H0cnXI';

function imgUpload(file, submit, url, fn) {
    this.fn = fn;
    var files1 = $('#' + file);
    var submit = $('#' + submit);
    var that = this;
    $(files1).on('change', function(e) {
        var file = e.target.files[0] || e.dataTransfer.files[0];
        if (file) {
            $(files1).css('border-color','#cccccc');
            var fileLoader = new FileReader();
            fileLoader.readAsDataURL(file);
            console.log(fileLoader);
            fileLoader.onload = function() {
                // 图片预览 看有什么图片
                // console.log(this.result)
            }
        }
    })
    $(submit).on('click', function() {
        var userInfo = JSON.parse(localStorage.getItem('userInfo'));
        if (userInfo) {
            //var app_access = userInfo.app_access;
            var token = userInfo.token;
            var val = $(files1).val();
            if (val) {
                var bossFile = document.getElementById(file).files[0];
                var formData = new FormData();
                formData.append('app_access', app_access);
                formData.append('token', token);
                formData.append('img', bossFile);
                // var data = {
                //     app_access: app_access,
                //     token: token,
                //     img: formData
                // }
                if (bossFile) {
                    $.ajax({
                        url: MC.HOST+url, // 后台上传图片接口
                        type: "post",
                        data: formData,
                        contentType: false,
                        processData: false,
                        dataType:"json",
                        success: function (data) {
                            that.fn(data)
                        },
                        error: function (err) {
                            that.fn(err)
                        }
                    })
                }
            } else {
                $(files1).css('border-color','red');
                getErrMsg('未选择图片');
            }
        } else {
            getErrMsg('请先登录');
        }
    })
}

function imgUpload2(file, url, fn) {
    this.fn = fn;
    var files1 = $('#' + file);
    var that = this;
    files1.on('change', function(e) {
        console.log(e, '&^&&^')
        var files = e.target.files[0] || e.dataTransfer.files[0];
        if (files) {
            var fileLoader = new FileReader();
            fileLoader.readAsDataURL(files);
            console.log(fileLoader);
            fileLoader.onload = function(e) {
                var e = e
                fileLoader.onloadend = function (e) {
                    files1.before(
                        `
                        <div class="m-load2">
                            <div class="line">
                                <div></div>
                                <div></div>
                                <div></div>
                                <div></div>
                                <div></div>
                                <div></div>
                            </div>
                            <div class="circlebg"></div>
                        </div>
                        `
                    )
                    files1.parent().css('background-image', 'url()');
                    var userInfo = JSON.parse(localStorage.getItem('userInfo'));
                    if (userInfo) {
                        //var app_access = userInfo.app_access;
                        var token = userInfo.token;
                        var val = files1.val();
                        if (val) {
                            var bossFile = document.getElementById(file).files[0];
                            var formData = new FormData();
                            formData.append('app_access', app_access);
                            formData.append('token', token);
                            formData.append('img', bossFile);
                            if (bossFile) {
                                $.ajax({
                                    url: MC.HOST+url, // 后台上传图片接口
                                    type: "post",
                                    data: formData,
                                    contentType: false,
                                    processData: false,
                                    dataType:"json",
                                    success: function (data) {
                                        var filedom = document.getElementById(file);
                                        var filedomparent = filedom.parentNode;
                                        if (data.code == 0) {
                                            filedomparent.style.backgroundImage = 'url('+data.data.img+')';
                                            $(filedomparent).find('input[type=hidden]').remove();
                                            files1.after('<input type="hidden" value="'+data.data.img+'"/>');
                                            files1[0].ImgSrc=data.data.img;
                                            //假如需要显示大图
                                            if (document.getElementById("showFile")) {
                                                $('#showFile').attr('src',data.data.big);
                                                $('#hideFile')[0].value = data.data.img;
                                            }
                                        } else {
                                            filedomparent.style.backgroundImage = 'url(../images/order/tianjiazhaop.png)'
                                            // files1.parent().css('background-image', 'url(../images/order/tianjiazhaop.png)');
                                        }
                                        files1.val('')
                                        files1.prev('.m-load2').remove();
                                        alertMsg(data.msg)
                                        
                                    },
                                    error: function (err) {
                                        files1.prev('.m-load2').remove();
                                        alertMsg('上传失败');
                                        files1.after(`<input type='hidden' value='1.png'/>`)
                                        files1.val(null)
                                        files1.parent().css('background-image', 'url(../images/order/tianjiazhaop.png)');
                                    }
                                })
                            }
                        } else {
                            alertMsg('未选择图片');
                        }
                    } else {
                        alertMsg('请先登录');
                    }
                }
            }
        }
    })
}